<!-- 录入工作池 -->
<template>
	<div class="fillcontain">
		<!-- 查询条件 -->
		<div class="fastQuery">
			<el-row>
				<el-col :span="2" class="fastQuery_title"><i class="el-icon-tickets"></i><span> 查询条件</span></el-col>
				<el-col :span="4" class="moreCondition">
					<span v-if="!isShow" @click="showorhide">更多条件 <i class="el-icon-d-arrow-right"></i></span>
					<span v-if="isShow" @click="showorhide">收起 <i class="el-icon-d-arrow-left"></i></span>
				</el-col>
				<el-col :span="8"></el-col>
			</el-row>
		</div>
		<!-- 查询表单 -->
		<el-form v-show="isShow" :model="searchParams" :rules="rules" ref="ruleForm" label-width="120px" class="search_container" >
			<el-row>
				<el-col :span="6" class="common-box">
					<el-form-item label="机构" prop="peOrgCode">
						<el-select clearable v-model="searchParams.peOrgCode" filterable placeholder="机构">
							<el-option v-for="item in companyOptions" :key="item.id" :label="item.dictValue"
							:value="item.id">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="保单号" prop="policy">
						<el-input clearable v-model="searchParams.policy" placeholder="保单号"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="受理号" prop="accepted">
						<el-input clearable v-model="searchParams.accepted" placeholder="受理号"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="任务状态" prop="itemStatus">
						<el-select clearable v-model="searchParams.itemStatus" placeholder="任务状态">
							<el-option v-for="item in itemStatusOptions" :key="item.id" :label="item.dictValue"
							:value="item.remark"></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="投保人" prop="appntName">
						<el-input clearable v-model="searchParams.appntName" placeholder="投保人"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="被保险人" prop="insuredName">
						<el-input clearable v-model="searchParams.insuredName" placeholder="被保人"></el-input>
					</el-form-item>
				</el-col>
				<!--  第二被保人需求  end      -->
				<el-col :span="6" class="text_center">
					<el-button type="primary" icon="el-icon-search" @click="queryData"></el-button>
					<el-button type="primary" plain icon="el-icon-refresh" @click="resetSearch"></el-button>
				</el-col>
			</el-row>
		</el-form>
		<div class="result-contain">
			<!-- 操作按钮 -->
			<el-row  class="pb10">
				<el-col :span="24">
					<el-button type="danger" plain @click="goManual(null)">
						<i class="el-icon-circle-plus-outline"></i>
						<span>手工录入</span>
					</el-button>
					<el-button type="danger" plain @click="forceEnd">
						<i class="el-icon-circle-close"></i>
						<span>强制结束</span>
					</el-button>
				</el-col>
			</el-row>
			<!-- 查询列表 -->
			<div class="table_container">
				<el-table ref="multipleDataTable" v-loading="loading" :data="tableData" highlight-current-row
					header-cell-class-name="table-header-class" style="width:100%"
					@row-click="selectSingleTableData">
					<el-table-column type="selection" width="50"></el-table-column>
          <el-table-column prop="peCode" label="体检任务号" align='center' show-overflow-tooltip min-width="150"></el-table-column>
					<el-table-column prop="taskNo" label="任务号" align='center' show-overflow-tooltip min-width="100">
					</el-table-column>
					<el-table-column prop="policyType" label="保单类型" align='center' show-overflow-tooltip min-width="80">
					</el-table-column>
					<el-table-column prop="orgName" label="机构" align='center' show-overflow-tooltip min-width="120">
						<template slot-scope="scope">
							<span>{{ scope.row.orgName | formatSsyMap(ssyMap) }}</span>
						</template>
					</el-table-column>
					<el-table-column prop="channel" label="渠道" show-overflow-tooltip min-width="50" align='center'>
					</el-table-column>
					<el-table-column prop="policy" label="保单号" show-overflow-tooltip align='center' min-width="100">
					</el-table-column>
					<el-table-column prop="accepted" label="受理号" show-overflow-tooltip min-width="80" align='center'>
					</el-table-column>
					<el-table-column prop="appntName" label="投保人" show-overflow-tooltip align='center' min-width="100">
					</el-table-column>
					<el-table-column prop="insuredName" label="被保险人" show-overflow-tooltip align='center' min-width="100">
					</el-table-column>
					<el-table-column prop="contractName" label="主合同名称" show-overflow-tooltip align='center' min-width="180">
					</el-table-column>
					<el-table-column prop="taskStatus" label="任务状态" show-overflow-tooltip sortable align='center' min-width="100">
						<template slot-scope="scope">
							<span>{{ scope.row.taskStatus | formatDict(itemStatusOptions, 'remark') }}</span>
						</template>
					</el-table-column>
					<el-table-column prop="updateTime" label="最近处理时间" show-overflow-tooltip align='center' min-width="160">
					</el-table-column>
					<!-- <el-table-column fixed="right" prop="imageInfo" label="影像信息" show-overflow-tooltip align='center' min-width="80">
						<template slot-scope="scope">
							<span class="operationIcon" @click="showImageList(scope.row.accepted)">
								<i class="el-icon-camera"></i>
							</span>
						</template>
					</el-table-column> -->
					<el-table-column fixed="right" label="操作" align='center' show-overflow-tooltip min-width="100">
						<template slot-scope="scope">
							<!-- <span class="operationIcon" @click="showRemark(scope.row.accepted)">
								<i class="el-icon-receiving"></i>
							</span> -->
							<!-- <span @click="goManual(scope.row.accepted)"> -->
							<el-button type="text" @click="goManual(scope.row)">查看</el-button>
								<!-- <i class="el-icon-receiving">查看</i> -->
								
							<!-- </span> -->
						</template>
					</el-table-column>
				</el-table>
				<!-- 分页 -->
				<el-row>
					<el-col :span="24">
						<div class="pagination">
							<el-pagination background v-if='paginations.total > 0' :page-sizes="paginations.pageSizes"
								:page-size="paginations.pageSize" :layout="paginations.layout"
								:total="paginations.total" :current-page='paginations.pageIndex'
								@current-change='handleCurrentChange' @size-change='handleSizeChange'>
							</el-pagination>
						</div>
					</el-col>
				</el-row>
			</div>
		</div>
		<!-- 操作组件 -->
		<!-- <remark-list :business="'NB'" :taskNo="remarkTaskNo" :drawer="showRemarkFlag" @close="hideRemark"></remark-list> -->
		<!--影像列表-->
		<cdfs-image-list ref="cdfsImage" :drawer="showImageFlag" :applnum="showImageApplnum" @close="hideImageList" :isFromEnterWork="true" @queryImage="queryImage"></cdfs-image-list>
	</div>
</template>

<script>
	import {
		selectItemTask,
		getCodeDictProject,
		closeAiItem,
		selectItemImage
	} from "@/api/taskCenter/enterWorkPool";

	import constant from '@/utils/constant';
	import mixins from '@/utils/mixins'
	import pageCall from "@/utils/pageCall";
	import {
		getSsyOrgMap,
	} from "@/api/taskCenter/taskCommon";

	import remarkList from "../remarkList";  //引入操作组件
	import CdfsImageList from "@/page/common/cdfsImageList";    //引入影像信息组件

	export default {
		mixins: [mixins],
		components: {
			CdfsImageList,  //影像组件
			remarkList,  //操作组件
		},
		data() {
			return {
				isShow: false, //控制查询条件显隐
				loading: false,
				changeTaskNo: "",
				showChangeFlag: false,
				showImageFlag: false,
				showImageApplnum: '',
				// remarkTaskNo: "",
				// showRemarkFlag: false,
				// 查询条件
				rules: {
					accepted: [{
						pattern: /^[0-9]*$/, //正则
						message: '受理号只能输入数字'
					}],
					policy: [{
						pattern: /^[0-9]*$/, //正则
						message: '保单号只能输入数字'
					}],
					channel: [],
					taskRank: [],
					markNo: [],
					institution: [],
					acceptdate: [],
					order: []
				},
				searchParams: {					
					policy: "", //保单号
					accepted: "", //受理号
					itemStatus: "", //任务状态
					appntName: "", //投保人姓名
					insuredName: "", //被保人
					peOrgCode: '',
				},
				//表格数据
				tableData: [],
				tableDataEdit: {},
				//需要给分页组件传的信息
				paginations: {
					total: 0, // 总数
					pageIndex: 1, // 当前位于哪页
					pageSize: 10, // 1页显示多少条
					pageSizes: [5, 10, 15, 20], //每页显示多少条
					layout: "total, sizes, prev, pager, next, jumper" // 翻页属性
				},
				companyOptions: [],
				itemStatusOptions: [],
				ssyMap: [],
			}
		},
		filters: {
			formatSsyMap(val, obj) {
				if(!val) return '';
				return obj[val] && obj[val].sorgname ? obj[val].sorgname : '';
			}
		},
		created() {
			// getSsyOrgMap().then(data => this.companyOptions = data);
			getCodeDictProject('itemStatus').then( res => {
				this.itemStatusOptions = res.data;
			});
			getCodeDictProject('peOrg').then( res => {
				this.companyOptions = res.data;
			});
			this.queryData();
			getSsyOrgMap().then(data => this.ssyMap = data);
			pageCall.$on('queryEnterWork',(showLoading)=>{
        this.queryData(showLoading);
      });
		},
		methods: {
			queryData(showLoading) {
				// 组装数据
				if(showLoading) this.show();
				let params = constant.deepClone(this.searchParams);
				params.pageNum = this.paginations.pageIndex;
				params.pageSize = this.paginations.pageSize;
				this.tableDataEdit = {};
				selectItemTask(params).then(res => {
					this.tableData = res.data.list;
					// 页码赋值
					this.paginations.pageIndex = res.data.pageNum;
					this.paginations.pageSize = res.data.pageSize;
					this.paginations.total = res.data.total;
					if(showLoading) this.cancle();
				})
				.catch(err => {
					this.tableData = [];
					this.cancle();
				})
			},
			// 点击展示查询条件
			showorhide() {
				this.isShow = !this.isShow;
			},
			// 每页多少条切换
			handleSizeChange(pageSize) {
				this.paginations.pageSize = pageSize;
				this.queryData();
			},
			show() {
				this.$store.dispatch('loading/CHANGE_LOADING', true);
			},
			cancle() {
				this.$store.dispatch('loading/CHANGE_LOADING', false)
			},
			// 上下分页
			handleCurrentChange(page) {
				this.paginations.pageIndex = page;
				this.queryData();
			},
			// 点击打开影像
			showImageList(applnum) {
				this.showImageApplnum = applnum;
				this.showImageFlag = true;
			},
			hideImageList() {
				this.showImageApplnum = '';
				this.showImageFlag = false;
			},
			// 点击跳转到手工录入
			goManual(row) {
				let arrTaskList = [];
				if(row) {
					arrTaskList[0] = row;
				} else {
					arrTaskList = this.$refs.multipleDataTable.selection;
				}
				
				// this.$refs.multipleDataTable.selection.forEach(item => {
				// 	arrTaskList.push(item['taskno']);
				// });
				if (arrTaskList.length === 0) {
					this.$message.error("请选择需要手工录入的任务！");
					return;
				} else if (arrTaskList.length !== 1) {
					this.$message.error("仅可选择一条需要手工录入的任务！");
					return;
				}
				// if(row != null) {
				// 	this.tableDataEdit = row;
				// }
				// if (this.tableDataEdit.itemId === undefined) {
				// 	this.$message.error("请选择需要手工录入的任务！");
				// 	return;
				// }
        let query = {
          itemId: arrTaskList[0].itemId,
          mainId: arrTaskList[0].id,
					peOrgCode: arrTaskList[0].peOrgCode,
					accepted:arrTaskList[0].accepted,
					peCode: arrTaskList[0].peCode,
					itemStatus: arrTaskList[0].itemStatus,
					taskNo: arrTaskList[0].taskNo,
          chdrNum: arrTaskList[0].policy,
        }
        if(row) {
          sessionStorage.setItem('manualEntryViewInfo',JSON.stringify(query))
          this.$router.push({path: '/home/taskCenter/manualEntryView'})
        } else {
          if(query.itemStatus != '1' && query.itemStatus != '2' && query.itemStatus != '5') {
            this.$message.error("请选择状态为待录入、已录入或核保失败的任务！");
					  return;
          }
          sessionStorage.setItem('manualEntryInfo',JSON.stringify(query))
          this.$router.push({path: '/home/taskCenter/manualEntry'})
        }
			},
			selectSingleTableData(row){
				this.tableDataEdit = row
			},
			// 强制结束
			forceEnd() {
				let arrTaskList = this.$refs.multipleDataTable.selection;
				if (arrTaskList.length === 0) {
					this.$message.error("请选择需要强制结束的任务！");
					return;
				} else if (arrTaskList.length !== 1) {
					this.$message.error("仅可选择一条需要强制结束的任务！");
					return;
				}
				// if (this.tableDataEdit.itemId === undefined) {
				// 	this.$message.error("请选择需要强制结束的任务！");
				// 	return;
				// }
				let { peCode, flow, taskStatus, itemId } = arrTaskList[0];
        this.$confirm('确认强制结束此任务?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.show();
					closeAiItem({
						peCode,
						flow,
						taskStatus,
						itemId
					}).then( result => {
						this.$message.success('任务已结束');
						this.cancle();
						this.paginations.pageIndex = 1;
						this.paginations.pageSize = 10;
						this.queryData();
					}).catch(error => {
						this.cancle();
					});
        }).catch(() => {});
			},
			// 重置条件
			resetSearch() {
				this.$refs['ruleForm'].resetFields();
			},
			queryImage(params) {
				selectItemImage(params).then (res => {
					this.$refs.cdfsImage.handleResponse(res);
				})
				.catch(err => {
					this.$store.dispatch('loading/CHANGE_LOADING', false);
				})
			}
		}
	}
</script>
<style lang="less" scoped >
	.fillcontain {
		padding-bottom: 0;
		.fastQuery {
			padding: 15px 20px 10px 20px;
			background: #fff;
			border-bottom: 1px solid #e1e1e1;
			.fastQuery_title {
					color: #666;
					padding: 6px 0px;
			}
			.fastQuery_item {
				margin: 0 10px;
			}
			.item_default {
				.el-button {
					color: #409EFF !important;
					border-color: #c6e2ff !important;
					background-color: #ecf5ff !important;
				}

			}
			.moreCondition {
				color: #68a3fc;
				cursor: pointer;
				padding: 6px 0px;

				.el-icon-d-arrow-right {
					transform: rotate(90deg);
				}

				.el-icon-d-arrow-left {
					transform: rotate(-90deg);
				}
			}
		}
	}
	.result-contain {
		background: #fff;
		padding: 10px;
		margin-bottom: 20px;
		// button i {
			//     margin-right: 6px;
			// }
	}


	.el-icon-d-arrow-right {
		transform: rotate(90deg);
	}

	.el-icon-d-arrow-left {
		transform: rotate(-90deg);
	}

	.search_container {
		padding: 20px 20px 0 20px;
	}

	.operationIcon {
		border: 1px solid #e5e5e5;
		border-radius: 50%;
		width: 22px;
		height: 22px;
		display: inline-block;
		cursor: pointer;
		box-shadow: 0 0 3px #f9f9f9;
	}

	.pagination {
		padding: 10px 20px;
		text-align: right;
	}
</style> 